<template>
  <!-- 授信管理 -->
  <el-dialog
    title="授信配置"
    :visible.sync="dialogVisible"
    width="30%"
    :before-close="handleClose"
  >
    <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="auto">
      <el-form-item label="授信额度" prop="amount">
        <c-number-input v-model="ruleForm.amount" placeholder="请输入授信额度">
          <template slot="append">万元</template>
        </c-number-input>
      </el-form-item>
      <el-form-item label="授信利率" prop="rate">
        <c-number-input v-model="ruleForm.rate" placeholder="请输入授信利率">
          <template slot="append"> % </template>
        </c-number-input>
      </el-form-item>
      <el-form-item label="授信有效期" prop="timeExpiry">
        <el-date-picker
          class="wh"
          :picker-options="pickerOptions(1)"
          v-model="ruleForm.timeExpiry"
          type="date"
          placeholder="选择授信有效期"
        >
        </el-date-picker>
      </el-form-item>
    </el-form>
    <span slot="footer">
      <el-button :loading="loading" @click="handleClose">取 消</el-button>
      <el-button :loading="loading" type="primary" @click="handleSubmit"
        >确 定</el-button
      >
    </span>
  </el-dialog>
</template>
<script>
export default {
  data() {
    return {
      dialogVisible: false,
      loading: false,
      ruleForm: {},
      rules: {
        amount: [
          { required: true, message: "请输入授信金额", trigger: "blur" },
        ],
        timeExpiry: [
          { required: true, message: "选择授信有效期", trigger: "change" },
        ],
        rate: [{ required: true, message: "请输入授信利率", trigger: "blur" }],
      },
    };
  },
  methods: {
    handleSubmit() {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          const data = JSON.parse(JSON.stringify(this.ruleForm));
          const sp = data.rate.split(".");
          if (sp.length <= 2) {
            const len = sp[sp.length - 1].length;
            if (sp.length != 1 && len >= 4) {
              this.$message.warning("授信利率超出限制");
              return;
            }
          }
          this.$confirm("是否确认此操作?", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }).then(() => {

            this.$emit('change',data)
            this.handleClose()
          });
        }
      });
    },
    handleOpen(item) {
      if (item) {
        this.ruleForm = JSON.parse(JSON.stringify(item));
      }
      this.dialogVisible = true;
    },
    handleClose() {
      this.ruleForm = {};
      this.$refs.ruleForm.resetFields();
      this.dialogVisible = false;
    },
  },
};
</script>
